<template>
    <div>
        <input type="text" v-model="inputVal">
        <button @click="handleBtn">添加</button>
    </div>
</template>

<script lang="ts">
    import { defineComponent, ref } from 'vue'
    import { useTodo, IUseTodo } from '../hooks/todoList'
    export default defineComponent({
        name: 'TodoInput',
        setup() {
            const inputVal = ref < string > ('')

            const { setTodo }: IUseTodo = useTodo()

            const handleBtn = (): void => {
                // 设置数据
                if (inputVal.value.length === 0) return
                setTodo(inputVal.value)
                inputVal.value = ''
            }
            return {
                inputVal,
                handleBtn
            }
        }

    })
</script>

<style>
</style>